---
id: start
title: 2. 快速启动
sidebar_label: 2. 快速启动
---

import useBaseUrl from "@docusaurus/useBaseUrl";

## 2.1 代码拉取

- 后端地址：[https://gitee.com/vben/vben-net](https://gitee.com/vben/vben-net)
- 前端地址：[https://gitee.com/vben/vben-vue](https://gitee.com/vben/vben-vue)

## 2.2 启动后端

### 2.2.1 修改配置
修改 Vben.App 下 applicationsettings.json中的数据库配置

<img src={useBaseUrl("img/base/02/01.png")}/>

> 此处配置的数据库需要提前建好，表会CodeFirst自动生成

### 2.2.2 通过VS启动
如果开发工具使用的是VS（Visual Studio）

1）将 Vben.Web 作为启动项

2）按下图选择，启动程序

<img src={useBaseUrl("img/base/02/02.png")}/>

> 启动后，会有一个控制台程序打开

<img src={useBaseUrl("img/base/02/03.png")}/>

3）浏览器输入地址：[http://localhost:5000](http://localhost:5000/) 或 [https://localhost:5001](https://localhost:5001/)，出现下图界面，则说明后端启动成功

<img src={useBaseUrl("img/base/02/04.png")} style={{ border: "1px solid #ccc"}}/>

### 2.2.3 通过Rider启动
如果开发工具使用的是Rider（Jetbrains系的开发工具）

1）按下图选择，启动程序

<img src={useBaseUrl("img/base/02/05.png")}/>

> 控制台程序已集成在IDE里

<img src={useBaseUrl("img/base/02/06.png")}/>

2）启动成功后，会自动打开浏览器 [https://localhost:5001](https://localhost:5001/)，出现下图界面，则说明后端启动成功

<img src={useBaseUrl("img/base/02/07.png")} style={{ border: "1px solid #ccc"}}/>

## 2.3 启动前端

### 2.3.1 安装依赖

```powershell
npm install
```

### 2.3.2 启动程序

```powershell
npm run dev
```

### 2.3.3 验证

1）启动成功后，打开浏览器 [http://localhost:868](http://localhost:868)，应该出现登录界面

<img src={useBaseUrl("img/base/02/08.png")}/>

2）点击登录，默认账号 sa，密码1，如出现以下界面，则说明前后端都启动成功且完成匹配

<img src={useBaseUrl("img/base/02/09.png")}/>













